<!DOCTYPE html>
<html>
<head>
	<title>选择角色</title>
	<link rel="stylesheet" id="csn-css-7ui" type="text/css" href="__HOME__/css/7ui.min.css">
</head>
<style>
	.top{height: 2rem;background: #0EA9EB;text-align: center;line-height: 2rem;color: #fff;position: fixed;width: 100%;z-index: 9;}
	.back{display: inline-block;width: 1.5rem;height: 1.5rem;background: url('/static/home/img/chat/back.png') no-repeat center / 1.5rem;float: left;margin:0.2rem;}
	.select_user{width: 100%;height: 100%;text-align: center;padding-top: 2rem;}
	.select_user ul li{width: 4.6rem;height: 4.6rem;float: left;margin:0.8rem;}
	.select_user ul li img{width: 100%;height: 100%;border-radius: 50%}
</style>
<body>
	<!-- 头部 -->
	<header class="top">
		<a href="#" class="back"></a>
		<span>选择角色</span>
	</header>
	<!-- 选择角色 -->
	<div class="select_user">
		<ul>
			<li><a href="{:url('Index/web_socket',['uid'=>1])}"><img src="/static/home/img/chat/header1.jpg"></a></li>
			<li><a href="{:url('Index/web_socket',['uid'=>2])}"><img src="/static/home/img/chat/header2.jpg"></a></li>
			<li><a href="{:url('Index/web_socket',['uid'=>3])}"><img src="/static/home/img/chat/header3.jpg"></a></li>
			<li><a href="{:url('Index/web_socket',['uid'=>4])}"><img src="/static/home/img/chat/header4.jpg"></a></li>
			<li><a href="{:url('Index/web_socket',['uid'=>5])}"><img src="/static/home/img/chat/header5.jpg"></a></li>
			<li><a href="{:url('Index/web_socket',['uid'=>6])}"><img src="/static/home/img/chat/header6.jpg"></a></li>
			<li><a href="{:url('Index/web_socket',['uid'=>7])}"><img src="/static/home/img/chat/header7.jpg"></a></li>
		</ul>
	</div>
</body>
<script src="__HOME__/js/jquery.min.js"></script>
<script src="__HOME__/js/7ui.min.js"></script>
<script>
	// 初始化rem
	_7ui(function() {
        _7ui.rem();
    });
</script>
</html>